"use strict";

//Функция полной загрузки страницы
window.onload = function () {

    //Запрет ввода цифр в поле "Full Name"
    let inputFullName = document.getElementById("fullName");
    inputFullName.onkeydown = (e) => {
        if (!isNaN(parseInt(e.key))) {
            return false;
        }
    }

    //Запрет ввода символов в поле Your username
    let inputUserName = document.getElementById("username");
    inputUserName.onkeydown = (e) => {
        if (",./+*|".indexOf(e.key) !== -1) {
            e.preventDefault();
        }
    }

    //Отслеживание checkbox
    let inputCheckbox = document.getElementById("check");
    inputCheckbox.onclick = function () {
        if (inputCheckbox.checked) {
            console.log("Согласен");
        } else {
            console.log("Не согласен");
        }
    }

    //Взамодействие с кнопкой Sign Up
    //Получаю поля пароля
    let passwordInput = document.getElementById("password");
    let repeatPasswordInput = document.getElementById("repeatPassword");

    //Проходим валидацию
    //Переменная для результата проверки
    let validationResult = true;
    function validation(form) {

        //Получаю все инпуты, чтобы проверить их циклом на заполненность
        const allInputs = form.querySelectorAll('input');

        for (const input of allInputs) {
            input.classList.remove("error");
            if (input.value === "") {
                input.classList.add("error");
                let sibling = input.previousElementSibling.textContent;
                alert(`Заполните поле ${sibling}`);
                return;
            }
        }

        passwordInput.classList.remove("error");
        if (passwordInput.value.length < 8 && passwordInput.value.includes("_") === false) {
            passwordInput.classList.add("error");
            alert("В поле password должно быть не менее 8 символов и содержать знак '_'");
            return;
        }
        repeatPasswordInput.classList.remove("error");
        if (repeatPasswordInput.value !== passwordInput.value) {
            repeatPasswordInput.classList.add("error");
            alert("Пароли не совпадают");
            return;
        }
        if (!inputCheckbox.checked) {
            alert("Вы не согласны с условиями");
            return;
        }

        return validationResult;
    }

    //Событие по нажатию на кнопку Sign Up
    function submit(event) {
        event.preventDefault();
        if (validation(this) === true) {
            document.getElementById('modal').classList.add("open");
        }
    }
    document.getElementById("form").addEventListener('submit', submit);



    //Событие по нажатию на кнопку OK и на ссылку после кнопки
    //Получаю блоки с инпутами и элементы в которых буду менять текст
    let formFullName = document.getElementById('form-input-full-name');
    let formEmail = document.getElementById('form-input-email');
    let formRepeatPass = document.getElementById('form-input-repeat-pass');
    let formCheckbox = document.getElementsByClassName('form-check')[0];
    let btnSummit = document.getElementById('btn');
    let formTitle = document.getElementsByClassName('form-title')[0];
    let linkHaveAccount = document.getElementById('link-account');


    //Функция для удаления и изменения элементов
    function changeElements() {
        formTitle.innerText = "Log in to the system";
        formFullName.remove();
        formEmail.remove();
        formRepeatPass.remove();
        formCheckbox.remove();
        linkHaveAccount.remove();
        btnSummit.innerText = "Sign in";
    }

    //Валидация формы входа (после нажатия на кнопку ОК или перехода по ссылке "Already have an account?")
    function validationSignIn(form) {

        //Получаю инпуты и проверяю их на заполненность
        const allInputs = form.querySelectorAll('input');

        for (const input of allInputs) {
            input.classList.remove("error");
            if (input.value === "") {
                input.classList.add("error");
                let sibling = input.previousElementSibling.textContent;
                alert(`Заполните поле ${sibling}`);
                return;
            }
        }
        return validationResult;
    }

    //Событие по нажатию на кнопку Sign in
    function submitSignIn(event) {
        event.preventDefault();
        if (validationSignIn(this) === true) {
            alert(`Добро пожаловать, ${inputUserName.value}!`);
            window.open('https://www.google.com/');
        }
    }

    //Клик по ссылке "Already have an account?"
    linkHaveAccount.onclick = function () {
        changeElements();
        //Перезаписываю событие 'submit'
        document.getElementById("form").removeEventListener('submit', submit);
        document.getElementById("form").addEventListener('submit', submitSignIn);
    };

    //Клик по кнопке ОК модального окна
    document.getElementById('modal-btn').onclick = function () {
        document.getElementById('modal').classList.remove("open");

        //Очищаю формы input
        const input = document.querySelectorAll('.input');
        for (let i = 0; i < input.length; i++) {
            input[i].value = "";
        }
        inputCheckbox.checked = false;
        changeElements();
        //Перезаписываю событие 'submit'
        document.getElementById("form").removeEventListener('submit', submit);
        document.getElementById("form").addEventListener('submit', submitSignIn);
    }
}